<template>
	<view class="query_detail_container">
		<!-- 已下架 -->
		<view class="no_package_box" v-if="isUploadPackage == '0'">
			<image :src="packageNoImg" mode="widthFix" class="no_package_img"></image>
		</view>

		<view class="" v-else-if="isUploadPackage == '1'">
			<!-- 顶图 -->
			<view class="detail_top_box">
				<image :src="packageDetail.image" mode="" class="detail_top_img"></image>
			</view>

			<view class="receiving_information">
				<view class="receiving_img_box">
					<image :src="receivingImg" mode="" class="receiving_img"></image>
				</view>
				<view class="receiving_box">
					<view class="buy-recipients-box">
						<view class="buy-recipients-bottom">
							<view class="buy-recipients-all">
								<view class="buy-recipients-input-title">收件姓名</view>
								<input placeholder="请填写收件人姓名"
									placeholder-style="font-size: 24rpx;font-family: Source Han Sans CN;font-weight: 400;color: #808080;"
									:border="false" v-model="applicantModel.userInfo.recipientsName" @input="blurName">
								</input>
							</view>
							<view class="buy-recipients-all">
								<view class="buy-recipients-input-title">收件电话 </view>
								<input placeholder="请填写收件电话"
									placeholder-style="font-size: 24rpx;font-family: Source Han Sans CN;font-weight: 400;color: #808080;"
									:border="false" maxlength="11" v-model="applicantModel.userInfo.recipientsPhone"
									@input="blurPhone">
								</input>
							</view>
							<view class="" v-if="isShowPersonMsg">
								<!-- v-if="packageDetail.need_idcard == 1" -->
								<view class="buy-applicant-input-box">
									<view class="buy-applicant-input-title">身份证姓名</view>
									<input v-model="applicantModel.userInfo.name"
										placeholder-style="font-size: 24rpx;font-family: Source Han Sans CN;font-weight: 400;color: #808080;"
										:border="false" placeholder="请输入身份证姓名" />
								</view>
								<!-- v-if="packageDetail.need_idcard == 1" -->
								<view class="buy-applicant-input-box">
									<view class="buy-applicant-input-title">身份证号码</view>
									<input placeholder="请输入身份证号码"
										placeholder-style="font-size: 24rpx;font-family: Source Han Sans CN;font-weight: 400;color: #808080;"
										maxlength="18" :border="false" v-model="applicantModel.userInfo.number">
									</input>
								</view>
								<view class="buy-recipients-all">
									<view class="buy-recipients-input-title" @click="handlerBuyList">收件地址 </view>
									<u-input v-model="city" placeholder="请选择省市区"
										placeholder-style="font-size: 24rpx;font-family: Source Han Sans CN;font-weight: 400;color: #808080;"
										type="select" @click="isShowPicker = true"></u-input>
									<u-picker v-model="isShowPicker" mode="region" @confirm="confirmPicker"></u-picker>
								</view>

								<view class="buy-recipients-all">
									<view class="buy-recipients-input-title">详细地址 </view>
									<input placeholder="请填写详细地址"
										placeholder-style="font-size: 24rpx;font-family: Source Han Sans CN;font-weight: 400;color: #808080;"
										:border="false" v-model="applicantModel.userInfo.recipientsAddress">
									</input>
								</view>


								<!-- v-if="packageDetail.is_upload_idcard == 1 && isShowPersonMsg" -->
								<view class="" v-if="packageDetail.is_upload_idcard == 1">
									<view class="buy-recipients-upload" @click="handlerUploadImg">
										<view class="front-box" v-if="!isShowFront">
											<view class="front-img-box">
												<image src="/static/packageDetail/img-front.png" mode=""
													class="front-img">
												</image>
											</view>
											<view class="front-add-box">
												<image src="/static/packageDetail/icon-add.png" mode=""
													class="front-add-img">
												</image>
												<view class="front-add-text">
													点击上传人面像
												</view>
											</view>
										</view>
										<image :src="frontImg" mode="" v-else style="width: 100%; height: 300rpx;">
										</image>
									</view>

									<view class="buy-recipients-upload" style="margin: 15rpx 0;"
										@click="handlerUploadOpposite">
										<view class="front-box" v-if="!isShowOpposite">
											<view class="front-img-box">
												<image src="/static/packageDetail/img-back.png" mode=""
													class="front-img">
												</image>
											</view>
											<view class="front-add-box">
												<image src="/static/packageDetail/icon-add.png" mode=""
													class="front-add-img">
												</image>
												<view class="front-add-text">
													点击上传背面像
												</view>
											</view>
										</view>
										<image :src="oppositeImg" mode="" v-else style="width: 100%; height: 300rpx;">
										</image>
									</view>

									<view class="buy-recipients-upload" @click="handlerUploadhand">
										<view class="front-box" v-if="!isShowHand">
											<view class="front-img-box">
												<image :src="frontBodyImg" mode="" class="front-img">
												</image>
											</view>
											<view class="front-add-box">
												<image src="/static/packageDetail/icon-add.png" mode=""
													class="front-add-img">
												</image>
												<view class="front-add-text">
													点击上传正面照
												</view>
											</view>
										</view>
										<image :src="handImg" mode="" v-else></image>
									</view>
								</view>
							</view>

							<view class="read_box">
								<view class="read_check">
									<u-checkbox-group @change="checkboxGroupChange">
										<u-checkbox v-model="checkMsg" :label-disabled="true"
											v-for="(item, index) in readList" :key="index"
											:name="item.name">{{item.name}}
											<span style="color: #FF7C00;"><span @click="handlerAgreement">《入网协议》</span>
												<span @click="handlerCollect">《信息收集公告》</span></span>
										</u-checkbox>
									</u-checkbox-group>
								</view>
								<view class="submit_box" @click="submit">
									<image :src="submitImg" mode="" class="submit_img">
									</image>
								</view>
							</view>

						</view>
					</view>
				</view>
			</view>

			<!-- 详情 -->
			<view class="detail_expenses">产品资费：</view>
			<view class="detail_bottom_box">
				<u-parse :html="packageDetail.details"></u-parse>
			</view>
		</view>

		<!-- 入网协议 -->
		<u-popup v-model="showAgreement" mode="center" :closeable="true" style="margin: 40rpx;">
			<view class="user_agreement_box">
				<h3 class="agreement_title">客户入网服务协议及业务协议</h3>
				<p class="text-content">
					欢迎您选择使用我们提供的通信服务。在您办理入网服务及相关业务之前，请仔细阅读以下客户入网服务协议及业务协议。本协议将明确双方的权利和义务，以确保您享受安全、稳定和优质的通信服务。
				</p>

				<p>
					一、协议范围
				</p>

				<p class="text-content">
					本协议适用于您作为客户，通过我们的各类营业网点（包括自有营业厅、手机营业厅、网上营业厅、授权合作代理商等）办理入网服务及相关业务。
				</p>
				<p>
					二、服务内容
				</p>

				<p class="text-content">
					我们将根据您的需求和选择，提供相应的通信服务和相关业务，包括但不限于固定电话、移动电话（含无线上网卡）的入网、过户、停复机等。具体服务内容和业务办理流程，请参考我们提供的相关业务规定和流程说明。
				</p>

				<p>
					三、客户资格和证件要求
				</p>

				<p class="text-content">
					1. 客户资格：作为客户，您应符合国家相关法律法规对通信服务的资格要求，并承诺提供真实、准确、合法的个人或机构信息。
				</p>
				<p class="text-content">
					2. 证件要求：您在办理入网服务及相关业务时，需出示有效证件原件并进行查验、登记。证件类型、要求和办理流程，请根据您所选择的通信服务和相关业务，参考我们的要求和规定。
				</p>

				<p>
					四、信息保护和隐私政策
				</p>

				<p class="text-content">
					1. 个人信息保护：我们承诺保护您的个人信息安全和机密，并采取适当的安全措施防止未经授权的访问、使用或泄露。具体信息收集、处理、使用和保护的方式，请参考我们的隐私政策和相关规定。
				</p>

				<p class="text-content">
					2. 信息使用授权：在您使用我们的通信服务和相关业务过程中，为了提供更优质、个性化的服务，我们可能会按照法律法规规定和/或协议约定使用您的个人信息。详细信息使用授权和范围，请参考我们的隐私政策。
				</p>

				<p>
					五、合规使用通信服务
				</p>
				<p class="text-content">
					1. 法律遵守：您应合法合规使用通信服务，遵守国家和地区的相关法律法规，不得利用通信服务从事非法活动或违反法规的行为。
				</p>
				<p class="text-content">
					2. 业务使用限制：您应根据通信服务的使用规定和协议约定，遵守业务的使用限制和规范，不得滥用或超越合理的使用范围。
				</p>

				<p>
					六、服务质量和故障处理
				</p>
				<p class="text-content">
					1. 服务质量：我们将尽力提供稳定、可靠的通信服务，保障通信质量和用户体验。如遇网络故障、技术问题等不可抗力因素，我们将积极处理，并及时通知客户。
				</p>
				<p class="text-content">
					2. 故障处理：如您遇到通信服务故障或问题，您可以联系我们的客户支持团队，我们将协助解决和处理相关故障。
				</p>
				<p>
					七、协议终止和违约责任
				</p>
				<p class="text-content">
					1. 协议终止：协议终止条件包括但不限于合同期满、双方协商一致、违约等情况。双方需遵守协议约定的终止程序和注意事项。
				</p>
				<p class="text-content">
					2. 违约责任：如一方违反协议约定，给对方造成损失的，应承担相应的违约责任，并赔偿对方的合理损失。
				</p>
				<p>
					八、其他条款
				</p>
				<p>
					1. 协议变更：根据业务发展和法律法规的要求，我们有权随时调整和修改本协议的内容。协议变更将通过适当的方式通知客户，并自变更生效之日起适用。
				</p class="text-content">
				<p class="text-content">
					2. 争议解决：如双方就本协议的解释和执行发生争议，应通过友好协商解决；协商不成的，可向有管辖权的法院提起诉讼。
				</p>
				<p class="text-content">
					请您在办理入网服务及相关业务之前，详细阅读并理解本协议的所有条款和内容。如您对本协议有任何疑问，请咨询我们的客户支持团队。一旦您办理入网服务及相关业务，即视为您已充分理解、同意并接受本协议的所有条款和约定。
				</p>

				<p class="text-content">
					感谢您的配合和支持！
				</p>
				<view class="" style="text-align: right;">
					<p>
						更新日期：2023-07-17
					</p>

					<p>
						生效日期：2023-07-17
					</p>
				</view>
			</view>
		</u-popup>

		<u-popup v-model="showMsgAgreement" mode="center" :closeable="true" style="margin: 40rpx;">
			<view class="privacy_agreement_box">
				<h3 class="privacy_title">隐私政策</h3>

				<p class="privacy_text">
					1.开发者处理的信息
				</p>

				<p class="privacy_text">
					开发者名称：山东集客仓信息科技有限公司
				</p>

				<p class="privacy_text">
					根据法律规定，开发者仅处理实现官网功能所必要的信息
				</p>

				<p class="privacy_text">
					为了保存照片，开发者将在获取你的明示同意后，使用你的相册（仅写入）权限
				</p>

				<p class="privacy_text">
					开发者 收集你选中的照片或视频信息，用于上传照片
				</p>

				<p class="privacy_text">
					为了识别头像，开发者将在获取你的明示同意后，收集你的微信昵称、头像
				</p>

				<p class="privacy_text">
					为了方便邮寄商品，开发者将在获取你的明示同意后，收集你的位置信息
				</p>

				<p class="privacy_text">
					开发者 收集你的地址，用于邮寄商品
				</p>

				<p class="privacy_text">
					为了联系用户，开发者将在获取你的明示同意后，收集你的手机号
				</p>

				<p class="privacy_text">
					开发者 收集你的身份证号码，用于识别身份信息是否合法
				</p>

				<p class="privacy_text">
					开发者 收集你的订单信息，用于查看订购的商品
				</p>

				<p class="privacy_text">
					开发者 收集你的邮箱，用于信息通知
				</p>

				<p class="privacy_text">
					开发者 获取你选择的位置信息，用于邮寄商品
				</p>

				<p class="privacy_text">
					开发者 将根据您的个人喜好和兴趣定向推送广告，为了提供更相关和个性化的广告体验，我们可能会收集和使用您的个人信息用于定向推送、精准营销
				</p>

				<p class="privacy_text">
					2.你的权益
				</p>

				<p class="privacy_text">
					关于你的个人信息，你可以通过以下方式与开发者联系，行使查阅、复制、更正、删除等法定权利
				</p>

				<p class="privacy_text">
					邮箱:2035712331@qq.com
				</p>

				<p class="privacy_text">
					3.开发者对信息的存储
				</p>

				<p class="privacy_text">
					开发者承诺，除法律法规另有规定外，开发者对你的信息的保存期限应当为实现处理目的所必要的最短时间
				</p>

				<p class="privacy_text">
					4.信息的使用规则
				</p>

				<p class="privacy_text">
					开发者将会在本指引所明示的用途内使用收集的信息
				</p>

				<p class="privacy_text">
					如开发者使用你的信息超出本指引目的或合理范围，开发者必须在变更使用目的或范围前，再次以微信方式告知并征得你的明示同意
				</p>

				<p class="privacy_text">
					5.信息对外提供
				</p>

				<p class="privacy_text">
					开发者承诺，不会主动共享或转让你的信息至任何第三方，如存在确需共享或转让时，开发者应当直接征得或确认第三方征得你的单独同意
				</p>

				<p class="privacy_text">
					开发者承诺，不会对外公开披露你的信息，如必须公开披露时，开发者应当向你告知公开披露的目的、披露信息的类型及可能涉及的信息，并征得你的单独同意
				</p>

				<p class="privacy_text">
					6.你认为开发者未遵守上述约定，或有其他的投诉建议、或未成年人个人信息保护相关问题，可通过以下方式与开发者联系；或者向微信进行投诉邮箱 : 2035712331@qq.com
				</p>
				<view class="privacy_date">
					<p>
						更新日期：2023-07-10
					</p>

					<p>
						生效日期：2023-07-10
					</p>
				</view>

			</view>
		</u-popup>
		
		<!-- 上传身份证示例弹窗 -->
		<upload-tip ref="refUploadTip" :uploadTipList="uploadTipList" />
	</view>
</template>

<script>
	import imageUrl from '@/utils/imgUrl.js'
	import parseQueryString from '@/utils/interceptUrl.js'
	import UploadTip from '@/components/uploadTip.vue'
	export default {
		components: {
			UploadTip
		},
		data() {
			return {
				receivingImg: 'https://file-1314054542.cos.ap-shanghai.myqcloud.com/cos_file/wechat_xcx/66836db786cb1_1719889335.png',
				packageId: '',
				packageDetail: {},
				applicantModel: {
					userInfo: {
						name: '',
						number: '',
						recipientsName: '',
						recipientsPhone: '',
						recipientsAddress: '',
						agentId: uni.getStorageSync('userInfo').agent_id ? uni.getStorageSync('userInfo').agent_id : '',
						shareId: ''
					},
				},
				blurNameMsg: '',
				blurPhoneMsg: '',
				isShowPersonMsg: false,
				city: '',
				readList: [{
					name: '我已阅读并同意'
				}],
				checkMsg: false,
				isShowOpposite: false,
				isShowFront: false,
				isShowHand: false,
				isShowPicker: false,
				showAgreement: false,
				showMsgAgreement: false,
				userId: '',
				agentId: '',
				fxuserId: '',
				level: '',
				pid: '',
				ppid: '',
				agentProId: '',
				packageNoImg: 'https://file-1314054542.cos.ap-shanghai.myqcloud.com/cos_file/xcx_static/65fe31ab1638e_1711157675.png',
				submitImg: 'https://file-1314054542.cos.ap-shanghai.myqcloud.com/cos_file/xcx_static/65fe322211eca_1711157794.png',
				sceneNumber: '',
				sceneObj: {},
				isUploadPackage: '',
				frontImg: '',
				oppositeImg: '',

				frontBodyImg: 'https://file-1314054542.cos.ap-shanghai.myqcloud.com/cos_file/wechat_xcx/66b5b2c3850a8_1723183811.png',
				uploadTipList: [{
						id: 0,
						img: 'https://file-1314054542.cos.ap-shanghai.myqcloud.com/cos_file/wechat_xcx/66cbe82bb090f_1724639275.jpg',
						title: '证件四角边缘空隙2厘米以上，手机横拍，照片清晰不模糊，无水印，无反光，无PS'
					},
					{
						id: 1,
						img: 'https://file-1314054542.cos.ap-shanghai.myqcloud.com/cos_file/wechat_xcx/66cbe83c29a87_1724639292.jpg',
						title: '证件四角边缘空隙2厘米以上，手机横拍，照片清晰不模糊，无水印，无反光，无PS'
					},
					{
						id: 2,
						img: 'https://file-1314054542.cos.ap-shanghai.myqcloud.com/cos_file/wechat_xcx/66cbe84680ac6_1724639302.jpg',
						title: '证件四角边缘空隙2厘米以上，手机横拍，照片清晰不模糊，无水印，无反光，无PS'
					},
				]
			}
		},
		onShow() {
			uni.hideHomeButton()
		},
		onLoad(options) {
			if (options) {
				const that = this
				const scene = decodeURIComponent(options.scene)
				if (scene) {
					that.sceneNumber = scene
					that.getMiniProgramScene()
				}
			}
			// this.packageId = options.package_id
			// this.applicantModel.userInfo.shareId = options.user_id ? options.user_id : uni.getStorageSync(
			// 	'userInfo').id
			// this.agentId = options.agent_id
			// this.fxuserId = options.fxuser_id
			// this.level = options.level
			// this.pid = options.pid
			// this.ppid = options.ppid
			// this.agentProId = options.agent_pro_id

			// this.getAgentPackageDetailByAgent()

			this.imgUrlNew = imageUrl
			this.addVisitCountClick()
		},
		methods: {
			// 访问统计接口
			addVisitCountClick() {
				this.$request('/addVisitCountClick', {
					tab: 'package_detail'
				}, 'GET').then(res => {

				})
			},

			// 查询微信小程序场景值接口
			getMiniProgramScene() {
				uni.request({
					url: 'https://saler.jkcae.com/app/getMiniProgramScene?id=' + this.sceneNumber,
					method: 'GET',
					success: res => {
						if (res.data.code == 1) {
							let sceneDetail = parseQueryString(res.data.data)
							this.sceneObj = sceneDetail
							this.getAgentPackageDetailByAgent()
						} else {
							uni.showToast({
								title: '查询失败',
								icon: 'none'
							})
							return
						}
					}
				})
			},

			// 获取套餐详情接口
			getAgentPackageDetailByAgent() {
				const that = this
				this.$request('/getAgentPackageDetailByAgent', {
					package_id: this.sceneObj.package_id,
					agent_id: this.sceneObj.agent_id,
					// fxuser_id: this.fxuserId,
				}, 'GET').then(res => {
					if (res.code == 1) {
						this.isUploadPackage = '1'
						this.packageDetail = res.data
						if (this.packageDetail.is_upload_idcard == 1) {
							that.$refs.refUploadTip.showUploadTip = true
						}
					} else {
						this.isUploadPackage = '0'
						uni.showToast({
							title: res.msg,
							icon: 'none',
							success: res => {
								setTimeout(() => {
									uni.navigateTo({
										url: '/pages/myShop/myShop?scene=' + this
											.sceneNumber
									})
								}, 1200)
							}
						})
						return
					}
				})
			},

			blurName(e) {
				this.blurNameMsg = e.detail.value
				var myreg = /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/;
				if (this.blurNameMsg !== '' && myreg.test(this.blurPhoneMsg)) {
					this.isShowPersonMsg = true
				}
			},

			blurPhone(e) {
				var myreg = /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/;
				this.blurPhoneMsg = e.detail.value
				if (this.blurNameMsg !== '' && myreg.test(this.blurPhoneMsg)) {
					this.isShowPersonMsg = true
				}
			},

			// 选择省市区
			confirmPicker(e) {
				this.city = e.province.label + e.city.label + e.area.label;
			},

			// 入网协议
			handlerAgreement() {
				this.showAgreement = true
			},

			// 信息收集公共
			handlerCollect() {
				this.showMsgAgreement = true
			},

			// 提交信息
			submit() {
				const that = this
				if (this.applicantModel.userInfo.recipientsName == '') {
					uni.showToast({
						title: '请输入收件姓名',
						icon: 'none'
					})
					return
				} else if (this.applicantModel.userInfo.recipientsPhone == '') {
					uni.showToast({
						title: '请输入收件电话',
						icon: 'none'
					})
					return
				} else if (this.applicantModel.userInfo.recipientsPhone.length !== 11) {
					uni.showToast({
						title: '请输入11位收件电话',
						icon: 'none'
					})
					return
				} else if (this.applicantModel.userInfo.name == '') {
					uni.showToast({
						title: '请输入身份证姓名',
						icon: 'none'
					})
					return
				} else if (this.applicantModel.userInfo.number == '') {
					uni.showToast({
						title: '请输入身份证号码',
						icon: 'none'
					})
					return
				} else if (this.applicantModel.userInfo.number.length !== 18) {
					uni.showToast({
						title: '请输入18位身份证号码',
						icon: 'none'
					})
					return
				} else if (this.city == '') {
					uni.showToast({
						title: '请选择地址',
						icon: 'none'
					})
					return
				} else if (this.applicantModel.userInfo.recipientsAddress == '') {
					uni.showToast({
						title: '请输入详细地址',
						icon: 'none'
					})
					return
				} else if (this.checkMsg == false) {
					uni.showToast({
						title: '请选择我已阅读并同意',
						icon: 'none'
					})
					return
				} else if (this.packageDetail.is_upload_idcard == '') {
					if (that.frontImg == '') {
						uni.showToast({
							title: '请上传身份证正面照',
							icon: 'none'
						})
						return
					} else if (that.oppositeImg == '') {
						uni.showToast({
							title: '请上传身份证背面照',
							icon: 'none'
						})
						return
					} else if (that.handImg == '') {
						uni.showToast({
							title: '请上传正面照',
							icon: 'none'
						})
						return
					}
				}

				this.getSubmit()
			},

			// 提交订单
			getSubmit() {
				const that = this
				this.$request('/salerOrderPut', {
					id_card_name: that.applicantModel.userInfo.name,
					contact: that.applicantModel.userInfo.recipientsName,
					mobile: that.applicantModel.userInfo.recipientsPhone,
					express_address: that.city + that.applicantModel.userInfo.recipientsAddress,
					package_id: this.sceneObj.package_id,
					// price: that.packageDetail.price,
					out_package_id: that.packageDetail.out_package_id ? that.packageDetail.out_package_id : null,
					package_name: that.packageDetail.name,
					src: '0',
					id_card: that.applicantModel.userInfo.number,
					idcard_front: this.frontImg,
					idcard_back: this.oppositeImg,
					user_with_idcard: this.handImg,
					agent_id: this.sceneObj.agent_id ? this.sceneObj.agent_id : '', // 代理id
					level: this.sceneObj.level,
					share_type: '2', // 分享方式 1：落地页 2：小店
					fxuser_id: this.sceneObj.fxuser_id ? this.sceneObj.fxuser_id : '',
					pid: this.sceneObj.pid ? this.sceneObj.pid : '',
					ppid: this.sceneObj.ppid ? this.sceneObj.ppid : '',
					agent_pro_id: this.sceneObj.agent_pro_id ? this.sceneObj.agent_pro_id : ''
				}, 'POST').then(res => {
					if (res.code == 1) {
						uni.showToast({
							title: res.msg ? res.msg : '提交成功',
							icon: 'none'
						})
						setTimeout(() => {
							this.applicantModel.userInfo.name = ''
							this.applicantModel.userInfo.number = ''
							this.applicantModel.userInfo.recipientsName = ''
							this.applicantModel.userInfo.recipientsPhone = ''
							this.applicantModel.userInfo.recipientsAddress = ''
							this.city = ''
							this.checkMsg = false
							uni.reLaunch({
								url: '/pages/myShop/myShop'
							})
						}, 1200)

					} else {
						uni.showToast({
							title: res.msg ? res.msg : '请勿重复提交订单',
							icon: 'none'
						})
						return
					}
				})
			},


			// 上传到服务器
			upload(tempFilePath, type) {
				const that = this
				uni.uploadFile({
					url: 'https://saler.jkcae.com/app/uploadFilesCompress', //项目的文件上传接口地址
					filePath: tempFilePath, // 本地文件路径
					name: 'file', // HTTP请求的文件名
					formData: {
						type: '19'
					},
					success: (res) => {
						let ress = JSON.parse(res.data)

						if (ress.code == 1) {
							if (type == 'renmian') {
								this.frontImg = ress.data.path
								this.isShowFront = true
							} else if (type == 'guohuimian') {
								this.oppositeImg = ress.data.path
								this.isShowOpposite = true
							} else if (type == 'shouchimian') {
								this.handImg = ress.data.path
								this.isShowHand = true
							}

						}
					}
				});
			},

			// 上传照片
			handlerUploadImg() {
				const that = this
				// 从相册或相机拍摄
				uni.chooseImage({
					sourceType: ["album", "camera"], // PC端无效
					count: 1, //最多可选择的图片数量
					sizeType: ["compressed"], //图片压缩
					success: (res) => {
						this.upload(res.tempFilePaths[0], 'renmian')
					},
					fail: (error) => {

					}
				});
			},

			handlerUploadOpposite() {
				uni.chooseImage({
					sourceType: ["album", "camera"], // PC端无效
					count: 1, //最多可选择的图片数量
					sizeType: ["compressed"], //图片压缩
					success: (res) => {
						this.upload(res.tempFilePaths[0], 'guohuimian')
					},
					fail: (error) => {

					}
				});
			},

			handlerUploadhand() {
				uni.chooseImage({
					sourceType: ["album", "camera"], // PC端无效
					count: 1, //最多可选择的图片数量
					sizeType: ["compressed"], //图片压缩
					success: (res) => {
						this.upload(res.tempFilePaths[0], 'shouchimian')
					},
					fail: (error) => {

					}
				});
			},

			checkboxGroupChange(e) {

			},


		}
	}
</script>

<style lang="scss" scoped>
	.query_detail_container {
		padding: 16rpx 20rpx;

		.no_package_box {
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
		}

		.detail_top_box {
			width: 100%;
			height: 670rpx;

			.detail_top_img {
				width: 100%;
				height: 100%;
			}
		}

		.receiving_information {
			position: relative;
			background: #fff0d5;
			padding: 85rpx 0 32rpx;
			margin-top: 20rpx;

			.receiving_img_box {
				position: absolute;
				top: 38rpx;
				left: 50%;
				transform: translateX(-50%);
				width: 439rpx;
				height: 76rpx;

				.receiving_img {
					width: 100%;
					height: 100%;
				}
			}

			.receiving_box {
				// height: 966rpx;
				background: #fff;
				border-radius: 20rpx;
				margin: 0 32rpx;

				.buy-recipients-box {
					margin-bottom: 30rpx;
					padding: 25rpx 25rpx 25rpx;

					.buy-recipients-top {
						display: flex;
						align-items: center;

						.buy-recipients-line {
							width: 7rpx;
							height: 32rpx;
							background: #598cf5;
							margin-right: 12rpx;
						}

						.buy-recipients-title {
							font-size: 30rpx;
						}
					}

					.buy-recipients-bottom {
						margin-top: 30rpx;

						.buy-applicant-input-box {
							display: flex;
							align-items: center;
							margin-bottom: 26rpx;
							border-bottom: 1px solid #F0F0F0;
							padding-bottom: 21rpx;

							.buy-applicant-input-title {
								width: 232rpx;
								font-size: 30rpx;
								// margin-right: 55rpx;
							}
						}

						.buy-recipients-all {
							display: flex;
							align-items: center;
							margin-bottom: 15rpx;
							padding: 10rpx 0 21rpx;
							border-bottom: 1px solid #F0F0F0;

							.buy-recipients-input-title {
								width: 232rpx;
								font-size: 30rpx;
							}
						}

						.read_box {
							padding-bottom: 20rpx;

							.read_check {
								font-family: Source Han Sans CN;
								font-weight: 400;
								color: #262626;


								::v-deep .u-checkbox__label {
									font-size: 24rpx;
								}
							}

							.submit_box {
								display: flex;
								justify-content: center;
								padding-top: 67rpx;

								.submit_img {
									width: 463rpx;
									height: 94rpx;
								}
							}
						}

						.buy-recipients-upload {
							position: relative;
							padding: 30rpx 30rpx;

							.front-box {
								// width: 80rpx;
								// height: 80rpx;
								// border: 1px dashed #000;
								text-align: center;
								line-height: 80rpx;

								.front-img-box {
									width: 100%;
									height: 308rpx;

									.front-img {
										width: 100%;
										height: 100%;
									}
								}

								.front-add-box {
									position: absolute;
									top: 50%;
									left: 50%;
									transform: translate(-50%, -50%);

									.front-add-img {
										width: 82rpx;
										height: 82rpx;
									}

									.front-add-text {
										font-size: 30rpx;
										font-family: Source Han Sans CN;
										font-weight: 500;
										color: #333333;
										padding-top: 10rpx;
									}
								}
							}
						}
					}
				}

			}
		}

		.detail_expenses {
			font-size: 28rpx;
			font-weight: 550;
			padding: 22rpx 0 16rpx;
		}

		.detail_bottom_box {


			.detail_bottom_img {}
		}

		.user_agreement_box {
			padding: 50rpx 30rpx 30rpx;

			.agreement_title {
				text-align: center;
				padding-bottom: 30rpx;
			}

			.text-content {
				text-indent: 2em;
			}
		}

		.privacy_agreement_box {
			padding: 50rpx 30rpx 30rpx;

			.privacy_title {
				text-align: center;
				padding-bottom: 30rpx;
			}

			.privacy_text {
				text-indent: 2em;
			}

			.privacy_date {
				text-align: right;
			}
		}
	}
</style>